<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0"> 
    <title>国象选品后台</title>
    <link rel="stylesheet" href="../../layui/css/layui.css"/>
    <!-- <link rel="stylesheet" href="css/admin.css"/>-->
     <style type="text/css">
	    .red {
	    color: #FF5722;
		}
		.layui-table td, .layui-table th {
    position: relative;
    padding: 9px 15px 0px 90px;
    min-height: 20px;
    line-height: 20px;
    font-size: 14px;
}
        .layui-table-cell {
            height: auto;
            line-height: 28px;
            }

    /**    .layer-photos-demo1 li{
		position: relative;
		width: 100px;
		height: 100px;
		float: left;
		margin-right: 10px;
	}
	.layer-photos-demo1 li span{
		display: block;
		height: 20px;
		text-align: center;
		background:rgba(0,0,0,.5);
		position: absolute;
		bottom:0;
		left: 0;
		width: 100%;
		font-size: 12px;
		color:#fff;
		cursor: pointer;
	}*/
	.layer-photos-demo1 img{
		width: 350px;
		height: 200px;
		cursor: pointer;
	}
	.layui-table img {
   max-width: 350px;
}

    </style>
    
</head>
<body>
    <form class="layui-form">
	    <table class="layui-table layui-table-add" lay-skin="nob">
		  <tbody>
		    <tr>
		      <th width="150">商品名称</th>
		      <td id ="goods_name_id">
		      </td>
		    </tr>
		    <tr>
		      <th width="150" >单价</th>
		      <td id ="final_price_id" class="red">
		      </td>
		      <td>
		         <input type="hidden" id="input_final_price_id" name="final_price"  />
		         <input type="hidden" id="input_sku_id" name="skuid"  />
		      </td>
		    </tr>
		    <!-- <tr>
		      <th width="150">订货数量</th>
		      <td><input type="text" id ="goods_num_id" name="goods_num" lay-verify="required|number"  style="width: 120px;display: inline;" placeholder="请输入订货数量" autocomplete="off" class="layui-input"><span>件</span></td>
		    </tr> -->
		    <tr>
		    <tr>
		      <th class="pad" style="vertical-align: middle">商品图</th>
		      <td>
		         <ul id="goods_image_url_id" class="layer-photos-demo1 mt10">
				  </ul>
		      </td>
		    </tr>
		     <tr >
		       <table class="layui-table layui-table-add" lay-skin="nob"  ><tbody id="goods_props_id"></tbody> </table>
		     </tr>
		    <tr>
		      <table class="layui-table layui-table-add" lay-skin="nob"  ><tbody>
		         <tr>
		              <th width="150">上传收获地址详情</th>
				      <td>
				        <!-- <div style="width: 50%;"  class='fl'>
				        	<select id="catgo_address_select" name="catgo_address_select" lay-verify="required">
							  <option value="">请选择地址</option>
							</select>  
				            </div> 
				         <div class='fl ml10'><div class="layui-btn layui-btn-primary add1">添加收货地址</div></div>-->
				         <input type="hidden" id="upload_status_id" name="upload_status"  />
				         <button type="button" class="layui-btn layui-btn-radius layui-btn-primary" id="test1"><i class="layui-icon">&#xe67c;</i>上传解析文件(xlsx格式)</button>
				         <span><a href="template.xlsx">下载xlsx模板</a></span>
				      </td>
		         </tr>
		      </tbody> </table>
		      
		    </tr>
		   <!--  <tr>
		      <th width="150">备注</th>
		      <td>
		      <input type="text" id ="remark_id" name="remark"  placeholder="备注信息,不超过200个字符" lay-verify="remark" autocomplete="off" class="layui-input"></input>
             </td>
		    </tr> -->
		    <tr>
		      <table class="layui-table layui-table-add" lay-skin="nob"  ><tbody>
		        <tr>
		           <th width="150">生成订单数</th>
		           <td id ="total_ordernum_id" class="red">0</td>
		        </tr>
		        <tr>
		         <th width="150">商品总数</th>
		        	<td id ="total_goodsnum_id" class="red">0 </td>
		         </tr>
		         <tr>
		      		<th width="150">订单总金额</th>
		      		<td id ="total_price_id" class="red">0 元</td>
		   		 </tr>
		      </tbody></table>
		     
		    </tr>
		    
		    
		   
		  </tbody>
		</table>
		<div style="margin-left: 145px; margin-bottom: 15px;">	
			<div lay-filter="user_submit_goods_order" lay-submit="" class="layui-btn" style=" min-width: 150px;">代拍</div>
		</div>
	</form>


	<script type="text/javascript" src="../../layui/layui.js"></script>
	
	
	<script>
		/** js小数乘法
		*@parameter arg1：被乘数（接受小数和整数）
		*@parameter arg2：乘数（接受小数和整数）
		*@parameter fix: 乘积保留几位（接受正负整数以及0）
		*/
	   function accMul(arg1,arg2,fix) { 
		    if(!parseInt(fix)==fix)
		    {
		        return;
		    }
		     var m=0,s1=arg1.toString(),s2=arg2.toString(); 
		     try{m+=s1.split(".")[1].length}catch(e){} 
		     try{m+=s2.split(".")[1].length}catch(e){}
		     if(m>fix){
		        return (Math.round(Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m-fix))/Math.pow(10,fix));
		     }else if(m<=fix){
		         return (Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)).toFixed(fix);
		     }else{
		        return (arg1*arg2).toFixed(fix);
		     }
		}


		layui.use(['jquery','form','upload','layer'], function(){
			var $ = layui.jquery
				,layer = layui.layer
				,form = layui.form,
				upload = layui.upload;
				
				//自定义验证规则
		    form.verify({
				remark: function(value){
					  if(value.length>200){
						return '备注不超过200个字符';
					  }
				}
		    });
		   /** $("#goods_num_id").bind('input propertychange',function(data){
		            value =$("#goods_num_id").val() ;
		            if(!(/^[0-9]+$/.test(value))){
					    $("#goods_num_id").val("");
					    $("#total_price_id").html("");
					    return ;
					}
					if(value>100){
					    value=100;
					    $("#goods_num_id").val(value);
					}
					if(value==0){
					    value=1
					    $("#goods_num_id").val(1);
					}
					//total_price = min_normal_price*value;
					$("#total_price_id").html(accMul(min_normal_price,  value,2)+"<span> 元</span>");
             });*/
				
			
			var goodsID = parent.goodsID;
			var goods_name =parent.goods_name;
			var goods_image_url =parent.goods_image_url ;
			var final_price =parent.final_price;
			
			$("#goods_name_id").html(goods_name);
			$("#final_price_id").html(final_price+"<span> 元</span>");
			$("#input_final_price_id").val(final_price);
			$("#goods_image_url_id").html("<img src='"+goods_image_url+"' />");
			
			/**$("body").on("click",".mt10 li img",function(e){
			ev =e.target ;
			    layer.photos({
			        photos: { "data": [{"src": e.target.src}] }
			    });
			});
			*/
			
			/**layer.photos({
			  photos: '#goods_image_url_id'
			  ,closeBtn: 1
			  ,anim: 0 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
			}); */
			
			  //执行实例
		    var uploadInst = upload.render({
			    elem: '#test1' //绑定元素
			    ,url: '../../web/upload_catgo_address_info' //上传接口
			    ,accept: 'file'
			    ,size:10240
			    ,done: function(res){
			      	//上传完毕回调
			      	$("#upload_status_id").val(res.status);
			      	if(res.status ==false){
			      		layer.alert(res.msg, { title: '信息',icon: 5});return ;
			      	}else{
			        	$("#total_goodsnum_id").html(res.total_goodsnum);//商品总数
			        	$("#total_ordernum_id").html(res.total_ordernum);//订单总数
			        	final_price = $("#input_final_price_id").val();
			        	//alert(final_price);
			        	$("#total_price_id").html(accMul(final_price,  res.total_goodsnum,2)+"<span> 元</span>");
			        	layer.alert(res.msg, { title: '信息',icon: 1});return ;
			      	}
			    }
			    ,error: function(res){
			      //请求异常回调
			      layer.alert("上传错误", { title: '信息',icon: 5});return ;
			    }
		     });
  
  			 $.ajax({
		                    type : "POST",
		                    async:false,
		                    url : "../../web/find_goods_props",
		                    data : {
		                    	goodsID:goodsID
	                    	},
		                    dataType : "json",
		                    success : function(data) {
		                    
		                            props_select = '';
		                            for(var x in data){
		                            
		                               props_select =props_select+
		                                   "<tr>"+
		      								"	<th width=\"150\">"+data[x].p_name+"</th>"+
		      								"	<td>  "+
		        							"		<div style=\"width: 50%;\"  class='fl'>"+
		        							"		<select lay-filter=\"business\" id=\""+data[x].p_name+"\" name=\"" +data[x].p_name+ "\" lay-verify=\"required\">"+
					  						"		<option value=\"\">请选择"+data[x].p_name+"</option>"+
											"		</select>  "+
		        							"		</div> "+
		     								"	 </td>";
		   								   "</tr>"  ;

									   // $("#111").append("<option value="+data[x].id+">"+data[x].value+"</option>");
		                            }
		                            $("#goods_props_id").html(props_select);
		                             for(var x in data){
		                                  for(var y in data[x].ll){
		                                    // alert(data[x].ll[y].value);
		                                     $("#"+data[x].p_name+"").append("<option value="+data[x].ll[y].id+">"+data[x].ll[y].value+"</option>");
		                                  }
		                             }
		                             
									 form.render('select');
									 //form.render();
		                    }
		      });
			/**$.ajax({
		                    type : "POST",
		                    async:false,
		                    url : "../../web/catgo_address_list",
		                    data : {
	                    	},
		                    dataType : "json",
		                    success : function(data) {
		                            for(var x in data){
									    $("#catgo_address_select").append("<option value="+data[x].id+">"+data[x].value+"</option>");
		                            }
									form.render('select');
		                    }
		     });
			$(document).on("click", ".add1", function() {
			   layer.open({
			      type:2
			      ,area:['80%', '40%']
			      ,title:"添加收货地址"
				  ,content: 'add_cargo_address.html'
				});
				
				
			});*/
		   /**绑定选择框事件     **/
		   form.on('select(business)', function(data){
                   values="";
	               $("select option:selected" ).each(function() {     //获取所有select 标签的值
	                    var val = $(this).val();
	                    if(val!=''){
	                       values = values+","+val;
	                    }
	               });
	               values =values.substring(1, values.length);
	               //alert(values);
	               $.ajax({
	                    type : "POST",
	                    url : '../../web/find_goods_sku_info',
	                    data : {
	                        spec_id:values
	                    },
	                    dataType : "json",
	                    success : function(data) {
	                             if(data.status==true){
	                               	///alert(data.finalPrice);
	                               $("#final_price_id").html(data.finalPrice+"<span> 元</span>");
	                               $("#input_final_price_id").val(data.finalPrice);
	                               $("#input_sku_id").val(data.sku_id);
	                               
	                               $("#total_price_id").html(accMul(data.finalPrice, $("#total_goodsnum_id").html() , 2)+"<span> 元</span>");
	                               
	                               $("#goods_image_url_id").html("<img src='"+data.thumbUrl+"' />");
							     }
	                    }
	               });
	               
            });
			
			 //监听提交
		   form.on('submit(user_submit_goods_order)', function(data){
		         var upload_status = $("#upload_status_id").val();
		         if(upload_status=='' || upload_status=='false'){
		         		layer.msg("请上传文件解析:"+upload_status, {icon: 5,time:2000});return ;
		         }
		         
		         var lock=false;//默认未锁定
		         var index =layer.open({
				  content: '您确定提交订单吗？'
				  ,btn: ['确定', '取消']
				  ,yes: function(index, layero){
				   	   if(!lock){
				   	        lock=true;//锁定
					    	//按钮【按钮一】的回调
				            $.ajax({
				                    type : "POST",
				                    url : '../../web/user_submit_goods_order',
				                    async:false,
				                    data : {
				                        s_form_data : JSON.stringify(data.field),
				                        //channel_user_id:channel_user_id,
				                        goodsID:goodsID
				                        //final_price:final_price
				                    },
				                    dataType : "json",
				                    success : function(data) {
						                    //if(data.statusCode==304){
					                               //layer.open({ content: '请求失效，请重新登录' ,btn: ['重新登录'],yes: function(index, layero){
													//    parent.parent.location.href="../../login.html"; 
												   //}});
											//	    location.href="../../web/direct_home";
											//	    return ;
				                        	//}
				                             if(data.status==false){
				                            	//layer.alert(data.msg, { title: '信息',icon: 5});
				                            	layer.msg(data.msg, {icon: 5,time:5000});
										    }else{
										        //layer.alert(data.msg, { title: '信息',icon: 1});
										         layer.msg(data.msg, {icon: 1,time:3000});
										         setTimeout("wait_exe()",3000) ;
										    }
				                    }
				             });
	            	 	}
				  }
				  ,btn2: function(index, layero){
				    //按钮【按钮二】的回调
				    layer.closeAll(index);
				    //return false 开启该代码可禁止点击该按钮关闭
				  }
				  ,cancel: function(){ 
				    //右上角关闭回调
				    //alert('0');
				    //return false 开启该代码可禁止点击该按钮关闭
				  }
				});
			    
			     return false;
		     });
			
		});
		
		function wait_exe (){
		   //var goods_index = parent.goods_index;
		   //window.parent.location.reload();
		   var index = parent.layer.getFrameIndex(window.name);
	       parent.layer.close(index);
	    }
	</script>
</body>
</html>